﻿<UserControl x:Class="SLExtensions.Showcase.PageStarSelector"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:sle="clr-namespace:SLExtensions.Controls;assembly=SLExtensions.Controls">
    <UserControl.Resources>
        <ControlTemplate x:Key="HeartTemplate">
            <Grid Margin="3">
                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="CommonStates">
                        <VisualState x:Name="StateNormal" />
                        <VisualState x:Name="StateHalfSelected">
                            <Storyboard>
                                <DoubleAnimation 
									Duration="0:0:0.05" To="1" 
									Storyboard.TargetProperty="(UIElement.Opacity)"
									Storyboard.TargetName="HalfItem" />
                                <DoubleAnimation 
									Duration="0:0:0.05" To="0" 
									Storyboard.TargetProperty="(UIElement.Opacity)"
									Storyboard.TargetName="FullItem" />
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="StateFullSelected">
                            <Storyboard>
                                <DoubleAnimation 
									Duration="0:0:0.05" To="0" 
									Storyboard.TargetProperty="(UIElement.Opacity)"
									Storyboard.TargetName="HalfItem" />
                                <DoubleAnimation 
									Duration="0:0:0.05" To="1" 
									Storyboard.TargetProperty="(UIElement.Opacity)"
									Storyboard.TargetName="FullItem" />
                            </Storyboard>
                        </VisualState>
                    </VisualStateGroup>
                    <VisualStateGroup x:Name="DisabledStates">
                        <VisualState x:Name="StateNotDisabled" />
                        <VisualState x:Name="StateDisabled">
                            <Storyboard>
                                <ColorAnimation Storyboard.TargetName="FullItemPath" To="#FFC1C1C1" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                <ColorAnimation Storyboard.TargetName="FullItemPath" To="#FF4F4F4F" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                <ColorAnimation Storyboard.TargetName="FullItemPath" To="#FFB9B9B9" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                <ColorAnimation Storyboard.TargetName="FullItemPath" To="#FF434343" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[1].(GradientStop.Color)" />

                                <ColorAnimation Storyboard.TargetName="HalfItemPath" To="#FFC1C1C1" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                <ColorAnimation Storyboard.TargetName="HalfItemPath" To="#FF4F4F4F" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                <ColorAnimation Storyboard.TargetName="HalfItemPath" To="#FFC1C1C1" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                <ColorAnimation Storyboard.TargetName="HalfItemPath" To="#FF4F4F4F" Duration="0:0:0" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[1].(GradientStop.Color)" />
                            </Storyboard>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>
                <Grid x:Name="EmptyItem" Background="Transparent">
                    <Path Stretch="UniformToFill"
						Data="F1 M 109.944,372.167C 99.3368,363.667 78.1215,346.667 62.1806,330.667C 46.2396,314.667 35.5729,299.667 32.7396,283.667C 29.9063,267.667 34.9063,250.667 42.4063,240C 49.9063,229.333 59.9063,225 69.4063,224C 78.9063,223 87.9063,225.333 95.2396,229.333C 102.573,233.333 108.24,239 112.24,243.61C 116.24,248.22 118.573,251.773 119.74,253.372C 120.906,254.972 120.906,254.618 121.74,252.847C 122.573,251.077 124.24,247.89 128.24,243.457C 132.24,239.025 138.573,233.346 146.073,229.34C 153.573,225.333 162.24,223 171.906,224C 181.573,225 192.24,229.333 199.906,240C 207.573,250.667 212.24,267.667 209.24,283.667C 206.24,299.667 195.573,314.667 179.573,330.667C 163.573,346.667 142.24,363.667 131.514,372.167C 120.788,380.667 120.67,380.667 120.611,380.667C 120.552,380.667 120.552,380.667 109.944,372.167 Z " 
						StrokeThickness="3" StrokeLineJoin="Round">
                        <Path.Stroke>
                            <RadialGradientBrush RadiusX="0.5" RadiusY="0.5" Center="0.5,0.5" GradientOrigin="0.5,0.5">
                                <GradientStop Color="#FFDDDDDD" Offset="0"/>
                                <GradientStop Color="#FF8B8B8B" Offset="0.995763"/>
                            </RadialGradientBrush>
                        </Path.Stroke>
                        <Path.Fill>
                            <RadialGradientBrush RadiusX="0.525" RadiusY="0.525" Center="0.5,0.5" GradientOrigin="0.5,0.5">
                                <RadialGradientBrush.RelativeTransform>
                                    <TransformGroup/>
                                </RadialGradientBrush.RelativeTransform>
                                <GradientStop Color="#FFF1F1F1" Offset="0"/>
                                <GradientStop Color="#FFA8A8A8" Offset="1"/>
                            </RadialGradientBrush>
                        </Path.Fill>
                    </Path>
                </Grid>
                <Grid x:Name="HalfItem" Background="Transparent" HorizontalAlignment="Left" Opacity="0">
                    <Path 
                        x:Name="HalfItemPath"
                        Stretch="UniformToFill" 
						Data="F1 M109.944,372.16699 C99.3368,363.66699 78.121498,346.66699 62.180599,330.66699 C46.239601,314.66699 35.572899,299.66699 32.739601,283.66699 C29.9063,267.66699 34.9063,250.66701 42.4063,240 C49.9063,229.33299 59.9063,225 69.406303,224 C78.906303,223 87.906303,225.33299 95.239601,229.33299 C102.573,233.33299 108.24,239 112.24,243.61 C116.24,248.22 118.573,251.77299 119.74,253.37199 C120.906,254.972 120.54655,256.14902 120.62788,256.14874 C120.6404,256.14871 120.67,380.66699 120.611,380.66699 C120.552,380.66699 120.552,380.66699 109.944,372.16699 z" 
						StrokeThickness="3" StrokeLineJoin="Round" Margin="0,0,0,0" Width="41.875" HorizontalAlignment="Left">
                        <Path.Stroke>
                            <RadialGradientBrush RadiusX="0.5" RadiusY="0.5" Center="0.5,0.5" GradientOrigin="0.5,0.5">
                                <GradientStop Color="#FFDDDDDD" Offset="0"/>
                                <GradientStop Color="#FF851993" Offset="0.995763"/>
                            </RadialGradientBrush>
                        </Path.Stroke>
                        <Path.Fill>
                            <RadialGradientBrush RadiusX="0.525" RadiusY="0.525" Center="0.5,0.5" GradientOrigin="0.5,0.5">
                                <RadialGradientBrush.RelativeTransform>
                                    <TransformGroup/>
                                </RadialGradientBrush.RelativeTransform>
                                <GradientStop Color="#FFF1F1F1" Offset="0"/>
                                <GradientStop Color="#FFE826E3" Offset="1"/>
                            </RadialGradientBrush>
                        </Path.Fill>
                    </Path>
                </Grid>
                <Grid x:Name="FullItem" Background="Transparent" Opacity="0">
                    <Path 
                        x:Name="FullItemPath"
                        Stretch="UniformToFill" 
						Data="F1 M 109.944,372.167C 99.3368,363.667 78.1215,346.667 62.1806,330.667C 46.2396,314.667 35.5729,299.667 32.7396,283.667C 29.9063,267.667 34.9063,250.667 42.4063,240C 49.9063,229.333 59.9063,225 69.4063,224C 78.9063,223 87.9063,225.333 95.2396,229.333C 102.573,233.333 108.24,239 112.24,243.61C 116.24,248.22 118.573,251.773 119.74,253.372C 120.906,254.972 120.906,254.618 121.74,252.847C 122.573,251.077 124.24,247.89 128.24,243.457C 132.24,239.025 138.573,233.346 146.073,229.34C 153.573,225.333 162.24,223 171.906,224C 181.573,225 192.24,229.333 199.906,240C 207.573,250.667 212.24,267.667 209.24,283.667C 206.24,299.667 195.573,314.667 179.573,330.667C 163.573,346.667 142.24,363.667 131.514,372.167C 120.788,380.667 120.67,380.667 120.611,380.667C 120.552,380.667 120.552,380.667 109.944,372.167 Z " 
						StrokeThickness="3" StrokeLineJoin="Round" >
                        <Path.Stroke>
                            <RadialGradientBrush RadiusX="0.5" RadiusY="0.5" Center="0.5,0.5" GradientOrigin="0.5,0.5">
                                <GradientStop Color="#FFDDDDDD" Offset="0"/>
                                <GradientStop Color="#FF851993" Offset="0.995763"/>
                            </RadialGradientBrush>
                        </Path.Stroke>
                        <Path.Fill>
                            <RadialGradientBrush RadiusX="0.525" RadiusY="0.525" Center="0.5,0.5" GradientOrigin="0.5,0.5">
                                <RadialGradientBrush.RelativeTransform>
                                    <TransformGroup/>
                                </RadialGradientBrush.RelativeTransform>
                                <GradientStop Color="#FFF1F1F1" Offset="0"/>
                                <GradientStop Color="#FFE826E3" Offset="1"/>
                            </RadialGradientBrush>
                        </Path.Fill>
                    </Path>
                </Grid>
            </Grid>
        </ControlTemplate>
    </UserControl.Resources>
    <StackPanel x:Name="LayoutRoot">
        <sle:StarSelector x:Name="StarSelector1" StarTemplate="{StaticResource HeartTemplate}" 
                            Margin="10" SetDisplayValueOnClick="True" Height="80" Width="450" 
                            Maximum="5" DisplayValue="2.9" ValueChanged="StarSelector1_ValueChanged" />
        <StackPanel Height="127" Width="500" Margin="10,0,10,0">
            <StackPanel Orientation="Horizontal" Height="38" Width="500">
                <TextBlock Text="Maximum Stars" VerticalAlignment="Center" />
                <Slider x:Name="SliderMaxStars" Minimum="0" Maximum="5" Value="5" Width="100" Margin="10" ValueChanged="SliderMaxStars_ValueChanged"/>
                <TextBlock x:Name="MaximumStarsValue" Text="5" VerticalAlignment="Center" />
            </StackPanel>
            <StackPanel Orientation="Horizontal" Height="38" Width="500">
                <TextBlock Text="Display Value" VerticalAlignment="Center" />
                <Slider x:Name="Slider1" Minimum="0" Maximum="5" Width="100" Margin="10" ValueChanged="Slider_ValueChanged"/>
                <TextBlock x:Name="SelectorValue" Text="0" VerticalAlignment="Center" />
            </StackPanel>
            <StackPanel Orientation="Horizontal" Height="17" Width="500">
                <CheckBox Content="Allow Half Star Selection" x:Name="AllowHalfStarSelection" Click="AllowHalfStarSelection_Click" />
            </StackPanel>
            <StackPanel Orientation="Horizontal" Height="17" Width="500">
                <CheckBox Content="Read Only" x:Name="ReadOnlyControl" Click="ReadOnlyControl_Click" />
            </StackPanel>
            <StackPanel Orientation="Horizontal" Height="17" Width="500">
                <CheckBox Content="Disabled" x:Name="DisableControl" Click="DisableControl_Click" />
            </StackPanel>
        </StackPanel>
    </StackPanel>
</UserControl>
